<template>
  <div class="listbody">
    <scroll :data="searchListContent" style="top:0px">
      <div slot="scroll">
        <city-item :searchListContent="searchListContent" @changeName="changeCity"></city-item>
      </div>
    </scroll>
  </div>
</template>

<script>
import Scroll from '../../components/Scroll/Scroll.vue';
import CityItem from '../../components/CityItem/CityItem.vue'
export default {
  name: 'SearchList',
  props: {
    searchListContent: Array
  },
  methods: {
    // 点击列表触发改变定位的事件
    changeCity (name) {
      this.$emit('changeName', name)
    }
  },
  components: {
    'scroll': Scroll,
    'city-item': CityItem
  }
}
</script>

<style lang="scss" scoped>
.listbody{
  width: 100%;
  height: calc(100% - 50px);
  background: #f5f5f5;
  position: absolute;
  top: 50px;
  left: 0;
  z-index: 1000;
}
</style>
